<template>
  <div class="et-quick-job">
    <et-header title="快速入职" @backPage="backPage"></et-header>

    <div class="quick-title">入职意向</div>

    <div class="quick-box">
      <div class="quick-job-pop">
        <span class="title">期望地址</span><span class="validator-icon">*</span>
        <x-address title="" v-model="address" :list="addressData" placeholder="请选择" class="address"
                   @on-hide="logHide"></x-address>
        <div class="back-box"><img src="../images/job/list/in.png" class="back" onclick="return false"/></div>
      </div>

      <div class="expect-job-content">
        <span class="title">期望职位</span><span class="validator-icon">*</span>
        <input type="text" v-model="expectJob" placeholder="请输入期望职位" maxlength="10" class="expect-job"/>
      </div>

      <div class="quick-job-pop">
        <span class="title">期望薪资</span>
        <popup-picker :data="moneyList" v-model="money" class="pop-value" placeholder="请选择"></popup-picker>
        <div class="back-box"><img src="../images/job/list/in.png" class="back" onclick="return false"/></div>
      </div>
    </div>

    <div class="quick-title">个人信息</div>
    <div class="quick-box">
      <div class="quick-job-pop">
        <span class="title">年龄</span>
        <popup-picker :data="ageList" v-model="age" class="pop-value" placeholder="请选择"></popup-picker>
        <div class="back-box"><img src="../images/job/list/in.png" class="back" onclick="return false"/></div>
      </div>
      <div class="quick-job-pop">
        <span class="title">性别</span>
        <popup-picker :data="sexList" v-model="sex" class="pop-value" placeholder="请选择"></popup-picker>
        <div class="back-box"><img src="../images/job/list/in.png" class="back" onclick="return false"/></div>
      </div>
    </div>


    <div class="btn-box">
      <button type="button" class="save" @click="submitJob">提交</button>
    </div>

    <div class="job-top"><span class="tip">温馨提示：提交成功后，请保持电话畅通。客服人员会尽快帮您寻找合适职位！</span></div>
  </div>
</template>

<script>
  import EtHeader from "../components/EtHeader";
  import {baseUrl} from "../../../config/env";
  import {PopupPicker, XAddress, ChinaAddressV3Data, Value2nameFilter as value2name} from 'vux';

  export default {
    name: "jobQuick",
    components: {
      EtHeader,
      PopupPicker,
      XAddress
    },
    data() {
      return {
        expectJob: '',
        money: [],
        moneyList: [['3k~4k', '4k~5k', '5k~6k', '6k~7k', '7k~8k', '8k~9k', '10+K']],
        age: [],
        ageList: [['18-25', '25-35', '35-45', '45以上']],
        sex: [],
        sexList: [['男', '女']],
        addressData: ChinaAddressV3Data,
        address: [],
        selectAddress: '',
        userSign: '',
        codeValue: ''
      }
    },
    created() {
      let base64 = require('js-base64').Base64;
      if (sessionStorage.getItem("et_user_sign")) {
        this.userSign = base64.decode(sessionStorage.getItem("et_user_sign"));
      }

      let temp = this.$route.query.workAddress;
      if (temp) {
        temp.split(',').forEach(item => {
          this.address.push(item);
        });

        let addressText = this.getName(this.address);
        this.selectAddress = addressText.split(' ').filter(item => item).join(' ');
      }
      if (this.$route.query.workPost) {
        this.expectJob = this.$route.query.workPost;
      }
      if (this.$route.query.workWage) {
        this.money.push(this.$route.query.workWage);
      }
      if (this.$route.query.age) {
        this.age.push(this.$route.query.age);
      }
      if (this.$route.query.sex) {
        this.sex.push(this.$route.query.sex);
      }
    },
    methods: {
      getName(value) {
        return value2name(value, ChinaAddressV3Data)
      },
      backPage() {
        this.$router.push("/jobList");
      },
      checkJob() {
        if (this.selectAddress === undefined || this.selectAddress === '') {
          this.$vux.toast.text("请选择期望地址", "middle");
          return;
        }
        if (this.expectJob === undefined || this.expectJob === '') {
          this.$vux.toast.text("请输入期望职位", "middle");
          return;
        }
        return true;
      },
      submitJob() {
        if (this.checkJob()) {
          if (parseInt(this.userSign) && typeof parseInt(this.userSign) == 'number') {
            this.$vux.loading.show({
              text: '加载中',
            });
            let tempSex = '';
            if (this.sex === '男') {
              tempSex = 1;
            } else if (this.sex === '女') {
              tempSex = 2;
            } else {
              tempSex = 0;
            }
            const sendData = {
              'workAddress': this.selectAddress,
              'workPost': this.expectJob,
              'workWage': String(this.money),
              'age': String(this.age),
              'sex': tempSex,
              'platform': 'ZY'
            };

            this.axios.post(`${baseUrl}/work/insert_quick_work?sgin=${this.userSign}`, sendData).then((res) => {
              let resultObj = res.data;
              this.$vux.loading.hide();
              if (resultObj.code == 0 && resultObj.data != null) {
                if (resultObj.data == 0) {
                  this.$vux.toast.text("快速入职失败,请稍后重试!", "middle");
                } else {
                  this.$router.push("/jobQuickNext");
                }
              } else {
                this.$vux.toast.text(resultObj.msg, "middle");
              }
            }).catch(() => {
              this.$vux.loading.hide();
              this.$vux.toast.text("网络异常", "middle");
            });
          } else {
            this.$router.push({
              path: "/etLogin",
              query: {
                'pageType': 2,
                'workAddress': this.codeValue?this.codeValue:this.$route.query.workAddress,
                'workPost': this.expectJob,
                'workWage': String(this.money),
                'age': String(this.age),
                'sex': String(this.sex)
              }
            });
          }
        }
      },
      logHide(type, value, codeValue) {
        if (type) {
          let temp = value.split(' ');
          const newArr = temp.filter(item => item);
          this.selectAddress = newArr.join(' ');
          this.codeValue = codeValue.join(',');
        }
      }
    }
  }
</script>

<style lang="stylus" scoped>
  @import "../../../assets/stylus/mixin.styl"

  .et-quick-job
    display: flex
    flex-direction: column
    wh(100%, 100%)
    background: #f5f5f5
    .quick-title
      display: flex
      align-items: center
      height: 0.8rem
      padding-left: 0.32rem
      size-color(0.347rem, #666)
    .quick-box
      wh(100%, auto)
      background: #fff
      .title
        font-size: 0.427rem
        color: rgba(51, 51, 51, 1)
      .validator-icon
        font-size: 0.427rem
        color: #F23730
      .expect-job-content
        display: flex
        align-items: center
        wh(96.8%, 1.28rem)
        margin-left: 3.2%
        border-bottom: 0.027rem solid rgba(242, 242, 242, 1)
        .expect-job
          wh(60%, 0.6rem)
          text-align: right
          margin-left: auto
          margin-right: 3.2%
          size-color(0.427rem, #666)
      .quick-job-pop
        display: flex
        align-items: center
        wh(96.8%, 1.28rem)
        margin-left: 3.2%
        .pop-value
          display: flex
          align-items: center
          margin-left: auto
          margin-right: 0.213rem
          size-color(0.427rem, #666)
          flex: 1
        .pop-value >>> .vux-tap-active
          width: 100%
        .pop-value >>> .vux-cell-primary .vux-popup-picker-select
          text-align: right !important
        .pop-value >>> .vux-cell-primary .vux-popup-picker-placeholder
          color: #ccc
        .address
          padding-top: 0.1rem
          padding-bottom: 0.1rem
          display: flex
          align-items: center
          margin-left: auto
          margin-right: 0.213rem
          size-color(0.427rem, #666)
          flex: 1
          ellipsis()
        .address >>> .vux-tap-active
          width: 100%
        .address >>> .weui-cell .vux-popup-picker-placeholder
          color: #ccc
        .address >>> .weui-cell .vux-popup-picker-value
          text-align: right !important
      .back-box
        margin-left: auto
        margin-right: 0.32rem
        .back
          wh(0.32rem, 0.32rem)
    .btn-box
      wh(100%, 1.28rem)
      text-align: center
      margin-top: 1.067rem
      .save
        wh(90.4%, 100%)
        line-height: 1.28rem
        background: rgba(60, 175, 255, 1)
        border-radius(0.16rem)
        size-color(0.453rem, rgba(255, 255, 255, 1))
    .job-top
      display: flex
      justify-content: center
      margin-top: 0.453rem
      width: 100%
      .tip
        width: 90.4%
        font-size: 0.373rem
        color: rgba(60, 175, 255, 1)
        line-height: 0.48rem
</style>


